<template>
    <div class="rowmain">
        <el-row :gutter="20">
            <el-col :span="6">
                <div class="grid-content drag" />
            </el-col>
            <el-col :span="6">
                <div class="grid-content drag" />
            </el-col>
            <el-col :span="6">
                <div class="grid-content drag" />
            </el-col>
            <el-col :span="6">
                <div class="right">
                    <el-row :gutter="20">
                        <el-col :span="8">
                            <el-icon class="icon" color="#409efc" @click="handleLogin(1)">
                                <SemiSelect />
                            </el-icon>
                        </el-col>
                        <el-col :span="8">
                            <el-icon class="icon" color="#409efc" @click="handleLogin(2)">
                                <FullScreen />
                            </el-icon>
                        </el-col>
                        <el-col :span="8">
                            <el-icon class="icon" color="#409efc" @click="handleLogin(3)">
                                <CloseBold />
                            </el-icon>
                        </el-col>
                    </el-row>
                </div>
            </el-col>
        </el-row>
    </div>
</template>
<script>
export default {
    components: {
    },
    data() {
        return {
        }
    },
    mounted() {
    },
    methods: {
        handleLogin(e) {
            window.ipcRenderer.send('window', e)
        },
    }
}
</script>
<style>
.romain {
    width: 100%;
    height: 60px;
}

.grid-content {
    border-radius: 4px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.right{
    border-radius: 4px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: right;
    padding-right: 20px;
}
</style>
